<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title></title>
</head>
<body>
<!--弹窗：预算编辑-->
<div th:fragment="budgetinfodetailEdit" class="modal inmodal fade" id="budgetinfodetailEdit_Modal"
     tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title" id="budgetinfodetailEdit_modalTitle">预算编辑</h4>
                <p id="budgetinfodetailEdit_modalDesc" class="font-bold text-danger"></p>
            </div>
            <div class="modal-body">
                <form id="budgetinfodetailEdit_Form">
                    <input id="budgetinfodetailEdit_id" name="id" type="hidden"/>
                    <input id="budgetinfodetailEdit_deptCode" name="deptCode" type="hidden"/>
                    <div class="row">
                        <div class="col-md-12">
                            <label for="budgetinfodetailEdit_deptName">预算部门</label>
                            <input class="form-control" id="budgetinfodetailEdit_deptName"
                                   name="deptName"/>
                        </div>
                        <div class="col-md-12">
                            <label for="budgetinfodetailEdit_projectCode">预算项目</label>
                            <input class="form-control typeahead" id="budgetinfodetailEdit_projectCode"
                                   name="projectCode" data-provide="typeahead" placeholder="输入名称或编码检索"/>
                        </div>
                        <div class="col-md-12">
                            <label for="budgetinfodetailEdit_cateCode">经济分类</label>
                            <input class="form-control typeahead" id="budgetinfodetailEdit_cateCode"
                                   name="cateCode" data-provide="typeahead" placeholder="输入名称或编码检索"/>
                        </div>
                        <div class="col-md-12">
                            <label for="budgetinfodetailEdit_money">金额</label>
                            <input class="form-control" id="budgetinfodetailEdit_money"
                                   name="money"/>
                        </div>
                        <div class="col-md-12">
                            <label for="budgetinfodetailEdit_remark">备注</label>
                            <textarea class="form-control" id="budgetinfodetailEdit_remark"
                                      name="remark"></textarea>
                        </div>
                    </div>
                </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="budgetinfodetailEditObj.saveHandle()">
                    保存
                </button>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(function () {
            $.myGet({
                url: `/zzsys/sysdicdata/list/ysxm`,
                success: function (data) {
                    if (data && data.code === 0) {
                        $('#budgetinfodetailEdit_projectCode').typeahead({
                            source: data.list.map(o=>{
                                o.name = `${o.text}（${o.value}）`;
                                return o;
                            }),
                            autoSelect: true,
                            showHintOnFocus: true
                        });
                    } else {
                        toastr.error(data.msg, '操作失败')
                    }
                }
            })
            $.myGet({
                url: `/zzsys/sysdicdata/list/jjfl`,
                success: function (data) {
                    if (data && data.code === 0) {
                        $('#budgetinfodetailEdit_cateCode').typeahead({
                            source: data.list.map(o=>{
                                o.name = `${o.text}（${o.value}）`;
                                return o;
                            }),
                            autoSelect: true,
                            showHintOnFocus: true
                        });
                    } else {
                        toastr.error(data.msg, '操作失败')
                    }
                }
            })
            $('#budgetinfodetailEdit_projectCode').change(function () {
                var current = $(this).typeahead("getActive");
                if (current) {
                    // Some item from your model is active!
                    if (current.name == $(this).val()) {
                        budgetinfodetailEditObj.myProject = current;
                    } else {
                        $(this).val('')
                    }
                } else {
                    $(this).val('')
                }
            });
            $('#budgetinfodetailEdit_cateCode').change(function () {
                var current = $(this).typeahead("getActive");
                if (current) {
                    // Some item from your model is active!
                    if (current.name == $(this).val()) {
                        budgetinfodetailEditObj.myCate = current;
                    } else {
                        $(this).val('')
                    }
                } else {
                    $(this).val('')
                }
            });
            budgetinfodetailEditObj.initForm();

        })
        var budgetinfodetailEditObj = new Object({
            myForm: $('#budgetinfodetailEdit_Form'),
            myModal: $('#budgetinfodetailEdit_Modal'),
            myDept: undefined,
            myProject: undefined,
            myCate: undefined,
            dataRule: {
                projectCode: {
                    required: true
                },
                cateCode: {
                    required: true
                },
                money: {
                    required: true,
                    number: true,
                    min: 0.01,
                    toDecimal2: true
                },
                remark: {
                    maxlength: 400
                }
            },
            initForm() {
                let _self = this;
                this.myForm.validate({
                    rules: this.dataRule,
                    submitHandler: function (form) {
                        _self.save(form);
                    }
                });
            },
            init(id = undefined, isCopy = false) {
                let _self = this;
                _self.myForm[0].reset();
                _self.myForm.find(`input[type='hidden']`).val("")
                if (id) {
                    $.myGet({
                        url: `/budget/tbudgetinfodetail/info/${id}`,
                        success: function (data) {
                            if (data && data.code === 0) {
                                let info = data.info;
                                for (let key in info) {
                                    if (_self.myForm.find(`input[name=${key}]`).length > 0) {
                                        _self.myForm.find(`input[name=${key}]`).val(info[key])
                                    }
                                }
                                _self.myForm.find(`textarea[name=remark]`).val(info['remark']);
                                _self.myForm.find(`input[name=projectCode]`).val(`${info['projectName']}（${info['projectCode']}）`);
                                _self.myForm.find(`input[name=cateCode]`).val(`${info['cateName']}（${info['cateCode']}）`);
                                _self.myDept = {value: info['deptCode'], text: info['deptName']};
                                _self.myProject = {value: info['projectCode'], text: info['projectName']};
                                _self.myCate = {value: info['cateCode'], text: info['cateName']};
                                if (isCopy) {
                                    _self.myForm.find(`input[name=id]`).val('');
                                }
                            } else {
                                toastr.error(data.msg, '操作失败')
                            }
                        }
                    })
                } else {
                    _self.myDept = {
                        value: budgetinfodetailObj.deptCode,
                        text: budgetinfodetailObj.deptName
                    };
                    _self.myForm.find(`input[name=deptCode]`).val(_self.myDept.value);
                    _self.myForm.find(`input[name=deptName]`).val(_self.myDept.text);
                }
                this.toggleModal(true)
            },
            toggleModal: function (show) {
                this.myModal.modal(show ? 'show' : 'hide');
            },
            save(form) {
                let _self = this;
                let formVals = $(form).serializeArray();
                let data = {}
                for (let i = 0; i < formVals.length; i++) {
                    data[formVals[i].name] = formVals[i].value;
                }
                if (!_self.myProject) {
                    toastr.error("请选择预算项目，如不存在请联系管理员添加", '操作提示')
                    return false;
                }
                if (!_self.myCate) {
                    toastr.error("请选择经济分类", '操作提示')
                    return false;
                }
                data.projectCode = _self.myProject.value;
                data.cateCode = _self.myCate.value;
                let tipArr = [];
                tipArr.push(`预算部门：${_self.myDept.text}`);
                tipArr.push(`预算项目：${_self.myProject.text}`);
                tipArr.push(`经济分类：${_self.myCate.text}`);
                tipArr.push(`金额：${$.moneyFormat(data.money)}`);
                tipArr.push(`备注：${data.remark}`);
                $.mySwalConfirm(tipArr.join("\r\n"), function () {
                    $.myPost({
                        url: `/budget/tbudgetinfodetail/${data.id ? 'update' : 'save'}`,
                        dataType: 'json',
                        data: data,
                        success: function (data) {
                            if (data && data.code === 0) {
                                toastr.success(data.msg, '操作提示')
                                budgetinfodetailObj.refreshTable();
                                _self.myModal.modal('hide')
                            } else {
                                toastr.error(data.msg, '操作失败')
                            }
                        }
                    })
                }, "请再次确认信息", "my-sweet");
            },
            saveHandle() {
                this.myForm.submit();
            }
        })
    </script>

</div>
</body>
</html>